
/* 三星头部js代码 */
onload = function() {
    daohanglan();
    cancelsearch();
    document.querySelector("#search").addEventListener("keydown",keyboard)
    document.querySelector(".sh-input").addEventListener("keydown",keyboard1)

    if (location.search.search("show")==-1){
        let searchvalue = document.querySelector(".sh-input").value;
        document.querySelector("#search").value=searchvalue;

        $.ajax({
            url:"/index",
            type:"post",
            data:{
                "v":"getfenye",
                searchvalue,
            },
            success:((resp)=>{
                let r=JSON.parse(resp);
                console.log(r)
                let fenyebox = document.querySelector(".searchresultpc-content-pagination");
                let html=``;
                html+=`${r.caiHong}`;
                fenyebox.innerHTML=html;
            })
        })
    }else {
        let xid=getQueryString("xid");
        $.ajax({
            url:"/goodsList",
            type:"post",
            dataType:"json",
            data:{
                "v":"xlfy",
                "pageNo":"1",
                 xid
            },
            success:(resp)=>{
                let fenyebox = document.querySelector(".searchresultpc-content-pagination");
                let html=``;
                html+=resp.pager.flcaihong;
                fenyebox.innerHTML=html;
            }
        })
    }
    document.querySelectorAll(".imgbox").forEach(i=>{
            i.addEventListener("click",function (){
            let paramvalue = event.currentTarget;
            let paramvalues = paramvalue.getAttribute("id")
            location.href="/productDetails"+paramvalues;
        })
    })

    future();

    document.querySelectorAll(".yclick").forEach(x=>{
        x.addEventListener("click",flquery);
    })

    console.log(document.querySelectorAll(".paixu input"))
    document.querySelectorAll(".paixu input").forEach(x=>{
        x.addEventListener("change",sxquery);
    })



    document.querySelector("#search").addEventListener("keydown",keyboard)
    document.querySelector("#search").addEventListener("input",searchtips)
    document.querySelector(".searchtip").addEventListener("mouseleave",function (){
        document.querySelector(".searchtip").style.display="none"
    })

    document.querySelectorAll(".xlli").forEach(x=>{
        x.addEventListener("mouseover",xllijdbc);
    })
    a =document.querySelector(".showNavtwoson").innerHTML;
    document.querySelector(".newtuijian").addEventListener("mouseover",function (){
        document.querySelector(".showNavtwoson").innerHTML=a;
    })
    document.querySelectorAll(".gnb_nav_center").forEach(x=>{
        x.addEventListener("mouseover",function (){
            document.querySelector(".showNavtwoson").innerHTML=a;
        })
    })

    document.querySelectorAll(".xlli").forEach(x=>{
        x.addEventListener("click",function (){
            let xid = parseInt(event.target.getAttribute("id"));
            location.href="/goodsList?xid="+xid+"&show="+1;
        })
    })


}


function sxquery(pageNo){
    if (isNaN(pageNo)){
        pageNo=1
    }
    let lsprice = document.querySelector(".lsprice").value;
    let rsprice = document.querySelector(".rsprice").value;
    let a=document.querySelectorAll(".yclick");
    let arr=new Array();
    a.forEach(aac=>{
        if (aac.style.borderColor=="rgb(150, 148, 148)"||aac.style.borderColor==""){

        }else {
            arr.push(aac.getAttribute("id"))
        }
    })
    $.ajax({
        url:"/goodsList?v=shaixuan",
        type:"post",
        dataType:"json",
        data:{
            "arr":JSON.stringify(arr),
            pageNo,
            lsprice,
            rsprice
        },
        success:((resp)=>{
            console.log(resp)
            if (resp.pager.data.length==0){
                document.querySelector(".el-menu-text1").innerHTML="";
                document.querySelector(".searchresultpc-content-container").innerHTML=`
                    <div class="sorry">
                            <div>对不起对应商品分类或筛选下没有商品</div>
                            <div>我们为您推荐了相关的其他商品</div>
                            <a href="/index">回到首页</a>
                        </div>
                `
            }else {
                let searchresultpc = document.querySelector(".searchresultpc-content-container");
                let html=``;
                document.querySelector(".el-menu-text1").innerHTML=`全部(`+(resp.pager.total)+`)`
                resp.pager.data.forEach(s=>{
                    html+=`<div class="phone_item">
                                <div class="phone_item_header">
                                    <span>新品</span>
                                    <span>免息</span>
                                    <span>买赠</span>
                                    <span>以旧换新</span>
                                </div>
                                <div class="Phone_item_container" style="text-align: center;">
                                    <img id="?sid=${s.sid}&lid=${s.lid}" class="imgbox" src="${s.url}" alt="" width="156px" height="168px" style="cursor: pointer;">
                                    <div class="Phone_item_switch">
                                    <span name="colors" type="radio" title="悠雾紫" class="BorderSwitch"
                                          style="cursor: pointer; background-color: rgb(212, 199, 217);"></span>
                                        <span name="colors" type="radio" title="悠远黑" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(33, 30, 22);"></span>
                                        <span name="colors" type="radio" title="悠野绿" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(95, 100, 90);"></span>
                                        <span name="colors" type="radio" title="悠柔白" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(240, 234, 224);"></span>
                                        <span name="colors" type="radio" title="远山灰" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(105, 108, 113);"></span>
                                        <span name="colors" type="radio" title="鲜棕绿" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(221, 228, 183);"></span>
                                    </div>
                                    <div class="Phone_item_name">
                                            ${s.sname}
                                    </div>
                                    <div class="Phone_item_money">
                                        ￥${s.sprice}.0
                                    </div>
                                </div>
                            </div>`
                })

                html+=`<div class="searchresultpc-content-pagination">`+`
                        ${resp.pager.sxcaihong}
                    </div>`
                searchresultpc.innerHTML=html;
            }
        })
    })
}

function getQueryString(name) {
    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
    var r = window.location.search.substr(1).match(reg);
    if (r != null) {
        return unescape(r[2]);
    }
    return null;
}
function flquery (pageNo){
    document.querySelector(".lsprice").value="";
    document.querySelector(".rsprice").value="";
        if (isNaN(pageNo)){
            pageNo=1
        }
        if (event.target.style.borderColor=="rgb(150, 148, 148)"||event.target.style.borderColor==""){
            event.target.style.borderColor="rgb(33, 136, 254)"
            event.target.style.color="rgb(33, 136, 254)"
        }else {
            event.target.style.borderColor="rgb(150, 148, 148)"
            event.target.style.color="rgb(150, 148, 148)"
        }
    // if (document.querySelector(".xlprice").style.borderColor=="rgb(33, 136, 254)"){
    //     paixu(pageNo);
    // }
        let a=document.querySelectorAll(".yclick");
        let arr=new Array();
        a.forEach(aac=>{
            if (aac.style.borderColor=="rgb(150, 148, 148)"||aac.style.borderColor==""){

            }else {
                arr.push(aac.getAttribute("id"))
            }
        })
        $.ajax({
            url:"/goodsList?v=xlfy",
            type:"post",
            dataType:"json",
            data:{
                "arr":JSON.stringify(arr),
                pageNo
            },
            success:((resp)=>{
                let searchresultpc = document.querySelector(".searchresultpc-content-container");
                let html=``;
                document.querySelector(".el-menu-text1").innerHTML=`全部(`+(resp.pager.total)+`)`
                resp.pager.data.forEach(s=>{
                    html+=`<div class="phone_item">
                                <div class="phone_item_header">
                                    <span>新品</span>
                                    <span>免息</span>
                                    <span>买赠</span>
                                    <span>以旧换新</span>
                                </div>
                                <div class="Phone_item_container" style="text-align: center;">
                                    <img id="?sid=${s.sid}&lid=${s.lid}" class="imgbox" src="${s.url}" alt="" width="156px" height="168px" style="cursor: pointer;">
                                    <div class="Phone_item_switch">
                                    <span name="colors" type="radio" title="悠雾紫" class="BorderSwitch"
                                          style="cursor: pointer; background-color: rgb(212, 199, 217);"></span>
                                        <span name="colors" type="radio" title="悠远黑" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(33, 30, 22);"></span>
                                        <span name="colors" type="radio" title="悠野绿" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(95, 100, 90);"></span>
                                        <span name="colors" type="radio" title="悠柔白" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(240, 234, 224);"></span>
                                        <span name="colors" type="radio" title="远山灰" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(105, 108, 113);"></span>
                                        <span name="colors" type="radio" title="鲜棕绿" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(221, 228, 183);"></span>
                                    </div>
                                    <div class="Phone_item_name">
                                            ${s.sname}
                                    </div>
                                    <div class="Phone_item_money">
                                        ￥${s.sprice}.0
                                    </div>
                                </div>
                            </div>`
                })

                html+=`<div class="searchresultpc-content-pagination">`+`
                        ${resp.pager.flcaihong}
                    </div>`
                searchresultpc.innerHTML=html;
            })
        })

}
function future(){
    $(".searchresultpc-content-container").on("click",".phone_item .imgbox",function (){
        let paramvalue = event.target;
        let paramvalues = paramvalue.getAttribute("id")
        location.href="/productDetails"+paramvalues;
    })
}

function isnull(){
    location.href="/login"
}
function iscart(){
    location.href="/goods"
}
function Login(){
    let login = document.querySelector("#Login");
    let levitation = document.querySelector("#levitation");

    login.onmouseenter = function (){
        levitation.style.display = "block";
    }
    levitation.onmouseleave = function (){
        levitation.style.display = "none";
    }
}

function fenye(pageNo){
    let searchvalue = document.querySelector("#search").value;
    $.ajax({
        url:"/index",
        type:"post",
        data:{
            "v":"fenye",
            searchvalue,
            pageNo,
        },
        dataType:"json",
        success:((resp)=>{
            let searchresultpc = document.querySelector(".searchresultpc-content-container");
            console.log(resp)
            let html=``;
            console.log(resp.pager.data)
            resp.pager.data.forEach(s=>{
                html+=`<div class="phone_item">
                                <div class="phone_item_header">
                                    <span>新品</span>
                                    <span>免息</span>
                                    <span>买赠</span>
                                    <span>以旧换新</span>
                                </div>
                                <div class="Phone_item_container" style="text-align: center;">
                                    <img id="?sid=${s.sid}&lid=${s.lid}" class="imgbox" src="${s.url}" alt="" width="156px" height="168px" style="cursor: pointer;">
                                    <div class="Phone_item_switch">
                                    <span name="colors" type="radio" title="悠雾紫" class="BorderSwitch"
                                          style="cursor: pointer; background-color: rgb(212, 199, 217);"></span>
                                        <span name="colors" type="radio" title="悠远黑" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(33, 30, 22);"></span>
                                        <span name="colors" type="radio" title="悠野绿" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(95, 100, 90);"></span>
                                        <span name="colors" type="radio" title="悠柔白" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(240, 234, 224);"></span>
                                        <span name="colors" type="radio" title="远山灰" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(105, 108, 113);"></span>
                                        <span name="colors" type="radio" title="鲜棕绿" class="BorderSwitch"
                                              style="cursor: pointer; background-color: rgb(221, 228, 183);"></span>
                                    </div>
                                    <div class="Phone_item_name">
                                            ${s.sname}
                                    </div>
                                    <div class="Phone_item_money">
                                        ￥${s.sprice}.0
                                    </div>
                                </div>
                            </div>`
            })
            html+=`<div class="searchresultpc-content-pagination">`+`
                        ${resp.pager.caiHong}
                    </div>`
            searchresultpc.innerHTML=html;
        })
    })
}


function keyboard1(){
    let keycode = event.keyCode;
    if (keycode == 13){
        search1();
    }
}
function search1(){
    let searchvalue = document.querySelector(".sh-input").value;
    if(searchvalue==""){
        event.preventDefault();
    }else {
        location.href="/index?v=search&searchvalue="+searchvalue;
    }
}


function cancelsearch(){
    let cancel = document.querySelector(".input-del");
    let  shinput = document.querySelector(".sh-input");
    cancel.addEventListener("click",function (){
        shinput.value="";
        location.href="/index?v=search&searchvalue=";
    })

}

function keyboard(){
    let keycode = event.keyCode;
    if (keycode == 13){
        search();
    }
}

function search(){
    let searchvalue = document.querySelector("#search").value;
    if(searchvalue==""){
        event.preventDefault();
    }else {
        location.href="/index?v=search&searchvalue="+searchvalue;
    }

}

function searchtips(){
    if (document.querySelector("#search").value==""){
        document.querySelector(".searchtip").style.display="none"
    }else {
        document.querySelector(".searchtip").style.display="block"
    }
    let searchvalue = document.querySelector("#search").value;
    $.ajax({
        url:"/index?v=searchtip",
        type:"post",
        data:{
            searchvalue
        },
        dataType:"json",
        success:(resp=>{
            if (resp.length>4){
                document.querySelector(".searchtip").style.height="80px";
                document.querySelector(".searchtip").style.overflowY="scroll";
            }else if (resp.length==0){
                document.querySelector(".searchtip").style.height="20px";
                document.querySelector(".searchtip").style.overflowY="";
            }else if(resp.length<4){
                document.querySelector(".searchtip").style.height="auto";
                document.querySelector(".searchtip").style.overflowY="";
            }
            let tipsbox = document.querySelector(".searchtip");
            let html=``;
            resp.forEach(r=>{
                html+=`<div onclick="bindfuture()">`+r.sname+`</div>`
            })
            tipsbox.innerHTML=html;
        })
    })
}

function bindfuture(){
    let divname = event.currentTarget.innerText;
    location.href="/index?v=search&searchvalue="+divname;
}


function xllijdbc(){
    let xid = parseInt(event.currentTarget.getAttribute("id"));
    $.ajax({
        url:"/index?v=searchli",
        type:"post",
        data:{
            xid
        },
        success:((resp)=>{
            let r = JSON.parse(resp);
            let showNavtwoson = document.querySelector(".showNavtwoson");
            let html = ``;
            r.forEach(y=>{
                html+=`<li onclick="chuandetail(${y.sid},${y.lid})">`+y.sname+`</li>`
            })
            showNavtwoson.innerHTML=html;
        })
    })
}

function chuandetail(params1,params2){
    location.href="/productDetails?sid="+params1+"&lid="+params2;
}



function daohanglan() {
    let allLi = document.querySelectorAll(".gnb_nav_center li");
    let show = document.querySelector("#show");
    let zzc = document.querySelector("#zzc");
    let img = document.querySelectorAll(".showNavone li span img");
    let showli = document.querySelectorAll(".showNavone li");
    let showNavtwoson = document.querySelector(".showNavtwoson");
    allLi.forEach(x => {
        x.addEventListener("mouseover", function() {
            document.querySelector("#show").style.height = 680 + "px";
            zzc.style.display = "block";
            console.log(document.querySelector("#show").style.height)
            showli.forEach(x => {
                x.style.fontWeight = "";
            })

            for (var i = 0; i < img.length; i++) {
                if (i == 0) {
                    img[i].style.display = "block";
                    document.querySelector(".showNavone li").style
                        .fontWeight = "bold";
                } else {
                    img[i].style.display = "none";
                }
            }
            allLi.forEach(y => {
                y.style.background = "#fff";
                y.style.color = "#000";
            })
            event.target.style.background = "#000";
            event.target.style.color = "#ffff";

            showNavtwoson.style.display = "block";
        })

    })
    document.querySelector(".gnb_nav").onmouseleave = function() {
        show.style.height = 0 + "px";
        zzc.style.display = "none";
        allLi.forEach(y => {
            y.style.background = "#fff";
            y.style.color = "#000";
        })
    }

    let cancel = document.querySelector("#cancelshow");
    cancel.addEventListener("click", function() {
        show.style.height = 0 + "px";
    })

    showli.forEach(x => {
        x.addEventListener("mouseover", function() {
            img.forEach(x => {
                x.style.display = "none";
            })
            let hhh = event.currentTarget.querySelector("span img");
            hhh.style.display = "block";
            showli.forEach(y => {
                y.style.fontWeight = "";
            })
            event.currentTarget.style.fontWeight = "bold";

            showNavtwoson.style.display = "none";
            setTimeout(() => {
                showNavtwoson.style.display = "block"
            }, 150);
        })
    })
}